<template>
    <el-drawer
            title="编辑配置"
            :visible.sync="drawer"
            :direction="direction"
            >
            <div class="demo-drawer-con">
                <el-form :model="list2">
                    <el-form-item label="密钥：" :label-width="formLabelWidth" prop="list">
                        <el-input v-model="list2.accessToken" autocomplete="off"></el-input>
                    </el-form-item>
                </el-form>
            </div>
            <div class="demo-drawer-footer">
                <el-button @click="cancelForm">关 闭</el-button>
                <el-button type="primary" @click="saveDrawer()" :loading="loading">{{ loading ? '提交中 ...' : '保 存' }}</el-button>
            </div>
    </el-drawer>
</template>
<script>
import { deviceToken } from '@/api/device/instance/instance'
export default {
    data(){
        return{
            drawer: false,
            loading: false,
            direction: 'rtl',
            formLabelWidth: '80px',
        }
    },
    props: ['list2'],
    methods:{
        saveDrawer(){
            deviceToken({
                accessToken: this.list2.accessToken,
                deviceId: this.list2.deviceId
            }).then(res => {
                if(res.data.code == 0){
                    this.drawer = false;
                    this.$message.success('修改密钥成功')
                }
            })
            
        },
        cancelForm(){
            this.loading = false;
            this.drawer = false;
            clearTimeout(this.timer);
        }
    }

}
</script>
<style scoped>
.demo-drawer-con{
    padding: 0 20px;
    font-size: 14px;
}
.demo-drawer-footer{
    position: absolute;
    right: 0px;
    bottom: 0px;
    width: 100%;
    border-top: 1px solid rgb(233, 233, 233);
    padding: 10px 16px;
    background: rgb(255, 255, 255);
    text-align: right;
}
</style>
<style>
    .el-drawer__header{
        border-bottom: solid 1px rgb(233, 233, 233);
        padding-bottom: 10px;
    }
</style>